<template>
  <div>
    <ClassSelector ref="selector"></ClassSelector>
    <div v-if="isSelectReady">
      <div>
        <el-card class="box-card"
                 v-for="(item,index) in cardList" :key="index">
          <div slot="header" class="clearfix">
            <span>讨论区主题：主题{{ index }}</span>
            <el-button style="float: right; padding: 3px 0" type="text"
                       @click="cardList.splice(index,1)">
              删除讨论区
            </el-button>
          </div>
          <el-collapse>
            <el-collapse-item v-for="(o,index) in discussList[index]" :key="o">
              <template slot="title">
                <!--                <span><el-tag type="info" size="mini">回复者</el-tag>  ：学生{{o}}</span>-->
                <span><el-tag type="info" size="mini">回复者</el-tag>  ：学生{{ o }}</span>
                <span></span>
              </template>
              {{ '列表内容 ' + o }}
            </el-collapse-item>
          </el-collapse>

        </el-card>
      </div>
    </div>
  </div>
</template>

<script>
import tc from '../../store/teacher'
import ClassSelector from "./utilComp/ClassSelector";

export default {
  name: "Discussion",
  components: {ClassSelector},
  computed: {
    isSelectReady() {
      return tc.getters.getIsSelectReady
    }
  },
  data() {
    return {
      chosenCourse: '',
      cardList: [11, 22, 33, 44],
      discussList: [
        [
          1, 2, 3
        ],
        [
          1
        ],
        [
          2
        ],
        [
          55
        ]
      ]
    }
  },
  methods: {}
}
</script>

<style scoped>
.box-card {
  margin: 15px;
}
</style>
